<!DOCTYPE html>
<html lang="en">
<head>
	<script src="/static/js/dev.js"></script>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<!--bootstrap插件-->
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
	<link href="/static/plugin/bootstrap/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"/>
	<link href="/static/plugin/jo/joUI.css" rel="stylesheet"/>
	<!--字体插件-->
	<link href="/static/plugin/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
	<link href="/static/plugin/layui-2.4.3/css/layui.css" rel="stylesheet"/>
	<!--ztree-->
	<link href="/static/plugin/zTree/css/metroStyle/metroStyle.css" rel="stylesheet"/>
	<!--common-->
	<link href="/static/css/common.css" rel="stylesheet"/>
	<!--帮助手册样式-->
	<link rel="stylesheet" type="text/css" href="/static/css/help/document.css">
	<!--代码高亮-->
	<link type="text/css" rel="stylesheet" href="/static/plugin/SyntaxHighlighter/styles/shCore.css"/>
	<link type="text/css" rel="stylesheet" href="/static/plugin/SyntaxHighlighter/styles/shCoreDefault.css"/>
	<link type="text/css" rel="stylesheet" href="/static/plugin/SyntaxHighlighter/styles/shThemeDefault.css"/>
	<title>joForm</title>
<script>

</script>
</head>

<body style="padding:5px 10px; box-sizing:border-box; background-color:white;">
<a href="#" target="_blank" class="showAtTop">显示单页</a>
<table class="docTable">
	<tr class="docTitle">
		<td colspan="2">
			<i class="fa fa-caret-down"> </i>joForm&nbsp;&nbsp;&nbsp;&nbsp;表单页面对象
		</td>
	</tr>
	<tr>
		<td colspan="2">
			<p>表单页面对象joForm对常用的表单操作进行了封装，集新增和编辑功能与一体，智能区分新增和编辑并进行有效的初始化，包含大量可用于自定义操作的托管函数。</p>
		</td>
	</tr>
</table>
<table class="docTable">
	<tr class="docTitle">
		<td colspan="2">
			<i class="fa fa-caret-down"> </i>托管函数
		</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.initFormPageBefore()</td>
		<td>初始化页面前置操作,此时页面已经确定是否为新增，新增页和编辑页都会执行此函数</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.initFormPageOfAdd()</td>
		<td>初始化新增页面操作(在初始化按钮前)</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.initFormValueBefore(oJson)</td>
		<td>初始化表单值前置操作(拿到数据，回显之前)</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.initFormValueAfter(formData)</td>
		<td>初始化表单值后置操作(此时已经回显完成)</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.dealDataAtSaveBefore(oData)</td>
		<td>新增数据前置处理,参数为表单数据</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.dealDataAtUpdateBefore(oData)</td>
		<td>修改数据前置处理</td>
	</tr>
	<tr>
		<td><iFunc/><boolean/>joForm.checkForm(form)</td>
		<td>表单验证,新增和修改共用,参数为表单jq对象</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.saveSuccessAfter(result)</td>
		<td>新增成功后处理回调函数,参数为后台返回结果</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.updateSuccessAfter(result)</td>
		<td>修改成功后的处理回调</td>
	</tr>
	<tr>
		<td><iFunc/>joForm.delSuccessAfter(result)</td>
		<td>删除成功后的处理回调函数</td>
	</tr>

</table>
<table class="docTable">
	<tr class="docTitle">
		<td colspan="2"><i class="fa fa-caret-down"> </i>属性</td>
	</tr>
	<tr>
		<td><attr><string/>PKName</attr></td>
		<td>主键字段，默认为ID</td>
	</tr>
	<tr>
		<td><attr><string/>PKValue</attr></td>
		<td>主键的值，joForm根据主键字段和主键值向后台请求待编辑数据的详情</td>
	</tr>
	<tr>
		<td><attr><string/>saveAfter</attr></td>
		<td>新增数据后的操作,close表示关闭窗口(默认),toEdit表示跳转编辑</td>
	</tr>
	<tr>
		<td><attr><string/>addUrl</attr></td>
		<td>[新增]数据的url</td>
	</tr>
	<tr>
		<td><attr><string/>deleteUrl</attr></td>
		<td>[删除]数据的url</td>
	</tr>
	<tr>
		<td><attr><string/>updateUrl</attr></td>
		<td>[修改]数据]的url</td>
	</tr>
	<tr>
		<td><attr><string/>formDataUrl</attr></td>
		<td>查询待编辑数据详情的url</td>
	</tr>
	<tr>
		<td><attr><boolean/>readonly2Label</attr></td>
		<td>表单回显完成后是否将只读元素转为文本,默认值为false</td>
	</tr>
	<tr>
		<td><attr><obj/>joForm.formData</attr></td>
		<td>编辑时，从后台获取的json数据，可以通过<code>joForm.formData.xxx</code>的形式调用</td>
	</tr>
	<tr>
		<td><attr><boolean/>joForm.isAdd</attr></td>
		<td>表单是否新增状态，true表示当前表单是新增状态，false表示当前表单属于编辑状态</td>
	</tr>
	<tr>
		<td><attr><obj/>joForm.form</attr></td>
		<td>表单form的jq对象，方便使用</td>
	</tr>
</table>

<table class="docTable">
	<tr class="docTitle">
		<td colspan="2">
			<i class="fa fa-caret-down"> </i>方法
		</td>
	</tr>
	<tr>
		<td><func><void/>joView.putParam</func></td>
		<td>参数设置,该方法有2个参数,参数1为key,参数2为value</td>
	</tr>
	<tr>
		<td><func><void/>joView.putParams</func></td>
		<td>批量参数设置,参数为{key:value}形式的对象</td>
	</tr>
	<tr>
		<td><iFunc><void/>joForm.initFormPageOfAdd()</iFunc></td>
		<td>新增页面的初始化</td>
	</tr>
	<tr>
		<td><iFunc><void/>joForm.saveSuccessAfter</func></td>
		<td>新增完成后的回调函数,参数为后台返回的结果</td>
	</tr>
	<tr>
		<td><iFunc><void/>joForm.initFormValueBefore</func></td>
		<td>初始化表单值的前置操作,参数为后台返回的待编辑json对象</td>
	</tr>
	<tr>
		<td><iFunc><void/>joForm.dealDataAtSaveBefore</func></td>
		<td>新增操作的前置处理,参数为向后台发送的json对象,可以在此处对发送的数据进行自定义处理</td>
	</tr>
	<tr>
		<td><iFunc><void/>joForm.dealDataAtUpdateBefore</func></td>
		<td>修改操作的前置处理,参数为向后台发送的json对象,可以在此处对发送的数据进行自定义处理</td>
	</tr>
	<tr>
		<td><iFunc><boolean/>joForm.checkForm</func></td>
		<td>表单验证托管函数,参数为待验证表单对象,即joView.form，返回boolean类型，当返回false时中断修改操作</td>
	</tr>
	<tr>
		<td><func><obj/>joForm.getJoViewWindow</func></td>
		<td>获取对应joView页面的window对象</td>
	</tr>
	
</table>
<div class="eg">
	<pre name="code" class="brush:js;toolbar:false;">
		&lt;script type="text/javascript">
	        $(function(){
	            var jParams = {
	                "PKName" : "id",//主键
	                "saveAfter" : "toEdit",
	                "addUrl" : "ums/app/insertApp.action",//新增
	                "deleteUrl" : "ums/app/deleteApp.action",//删除
	                "updateUrl" : "ums/app/updateApp.action",//修改
	                "formDataUrl" : "ums/app/getAppList.action"	//查询
	            };
	            joForm.initFormPage(jParams);//初始化
	        });
	        //初始化表单值之前,格式化时间
	        joForm.initFormValueBefore = function(oJson){
	            oJson.updateTime = jo.formatTime(oJson.updateTime);
	        };
	    &lt;/script>
	</pre>
	<pre name="code" class="brush:xml;toolbar:false;">
		<!--按钮栏-->
		<div class="form-group button-bar">
		    <button type="button" isShow="joForm.isAdd" class="btn btn-sm btn-outline btn-default" onclick="joForm.save()">
		        <i class="fa fa-plus-circle" aria-hidden="true"></i>&nbsp;新增
		    </button>
		    <button type="button" isShow="!joForm.isAdd" class="btn btn-sm btn-outline btn-default" onclick="joForm.update()">
		        <i class="fa fa-pencil-square" aria-hidden="true"></i>&nbsp;修改
		    </button>
		    <button type="button" isShow="!joForm.isAdd" class="btn btn-sm btn-outline btn-default" onclick="joForm.del()">
		        <i class="fa fa-trash" aria-hidden="true"></i>&nbsp;删除
		    </button>
		</div>
		<!--表单-->
		<form id="pageForm" name="pageForm" action="" method="post">
		    <table class="table table-bordered  table-condensed dataTables-example dataTable no-footer">
		        <tr>
		            <td width="15%" class="active" align="">编　　号</td>
		            <td class="tnt">
		                <%--<input type="text" name="ID"/>--%>
		                <input type="text" name="id" class="form-control input-sm readonly-edit" placeholder="应用系统代号" ErrEmpty="应用系统代号不允许为空">
		            </td>

		            <td width="15%" class="active must">应用名称</td>
		            <td>
		                <input type="text" name="name" class="form-control input-sm" ErrEmpty>
		            </td>
		        </tr>
		        <tr>
		            <td class="active">备　　注</td>
		            <td>
		                <input type="text" name="remark" class="form-control input-sm">
		            </td>
		            <td class="active">修改时间</td>
		            <td>
		                <input type="text" name="updateTime" onclick="laydate()" readonly class="form-control input-sm">
		            </td>
		        </tr>
		    </table>
		</form>
	</pre>
</div>

<!--配置信息-->
<script src="/static/js/config.js"></script>
<!--jquery-->
<script src="/static/plugin/jquery/jquery-3.3.1.js"></script>
<script src="/static/plugin/jquery/jquery.cookie.js"></script>
<!--bootstrap-->
<script src="/static/plugin/bootstrap/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!--[if lt IE 9]>
<script src="/static/plugin/other/html5shiv.js"></script>
<script src="/static/plugin/other/respond.min.js"></script>
<![endif]-->
<!--layui-->
<script src="/static/plugin/layui-2.4.3/layui.all.js"></script>
<!--ztree-->
<script src="/static/plugin/zTree/js/jquery.ztree.all.js"></script>
<!--jo-->
<script src="/static/plugin/jo/jo.js"></script>
<script src="/static/plugin/jo/jo-adapt.js"></script>
<script src="/static/plugin/jo/jo-page-view.js"></script>
<script src="/static/plugin/jo/jo-page-form.js"></script>
<script src="/static/plugin/jo/jo-listener.js"></script>
<!--common-->
<script src="/static/js/common.js"></script>
<!--帮助手册js-->
<script src="/static/js/help/document.js"></script>
<!--代码高亮-->
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shCore.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushCSharp.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushPhp.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushJScript.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushJava.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushVb.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushSql.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushXml.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushDelphi.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushPython.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushRuby.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushCss.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushCpp.js"></script>
<script class="javascript">
	highLight();
</script>
</body>
</html>
